{% extends 'admin/dashboard.html' %}

{% block content %}
<div class="card">
    <h2 class="text-xl font-bold mb-4">轮播图管理</h2>
    <a href="{{ url_for('admin_carousel_edit') }}" class="inline-block mb-4 px-4 py-2 bg-green-500 text-white rounded">添加轮播图</a>
    
    <table class="min-w-full divide-y divide-gray-200">
        <thead class="bg-gray-50">
            <tr>
                <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">ID</th>
                <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">标题</th>
                <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">图片</th>
                <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">排序</th>
                <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">操作</th>
            </tr>
        </thead>
        <tbody class="bg-white divide-y divide-gray-200">
            {% for carousel in carousels %}
            <tr>
                <td class="px-6 py-4 whitespace-nowrap">{{ carousel.id }}</td>
                <td class="px-6 py-4 whitespace-nowrap">{{ carousel.title }}</td>
                <td class="px-6 py-4 whitespace-nowrap">
                    {% if carousel.image_url %}
                    <img src="{{carousel.image_url }}" alt="轮播图" class="w-20 h-20 object-cover">
                    {% endif %}
                </td>
                <td class="px-6 py-4 whitespace-nowrap">{{ carousel.sort_order }}</td>
                <td class="px-6 py-4 whitespace-nowrap">
                    <a href="{{ url_for('admin_carousel_edit', id=carousel.id) }}" class="inline-block px-2 py-1 bg-blue-500 text-white rounded mr-2">编辑</a>
                    <a href="javascript:if(confirm('确定要删除吗？')){window.location='{{ url_for('delete_carousel', id=carousel.id) }}'}" class="inline-block px-2 py-1 bg-red-500 text-white rounded">删除</a>
                </td>
            </tr>
            {% endfor %}
        </tbody>
    </table>
</div>
{% endblock %}